<template>
  <view>
    <view class="top" :style="{height:height+'px',backgroundColor:color}"></view>
    <view :style="{height:height+'px'}"></view>
  </view>
</template>

<script>
  export default {
    name: "myheader",
    props: {
      color: {
        type: String,
        default: '#0ff'
      }
    },
    data() {
      return {
        height: 0
      };
    },
    created() {
      this.height = uni.getSystemInfoSync().statusBarHeight + 5
    }
  }
</script>

<style scoped>
  .top {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9;
  }
</style>
